<?xml version="1.0"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
        "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
	<title>DHTML Performance Tip: Shorten Object Chains</title>
	<style type="text/css" media="screen">
/* <![CDATA[ */
body script {
	display: block;
	visibility: visible;
	white-space: pre;
}
/* ]]> */
</style>
</head>
<body>

<h1>DHTML Performance Tip: Shorten Object Chains</h1>
<form method="get">
	<table border="1" frame="border">
		<tr>
			<td>
				<input type="button" value='test longRef()' 
					onclick='document.getElementById("long").value = longRef()' />
			</td>
			<td>
				<input type="text" id='long' 
				value="" size="30" />
			</td>
		</tr>
		<tr>
			<td>
				<input type="button" value='test shortRef()' 
					onclick='document.getElementById("short").value = shortRef()' />

			</td>
			<td>
				<input type="text" id='short' size="30" />
			</td>
		</tr>
	</table>
</form>
<pre>
<script type="text/javascript" defer="defer">
// <![CDATA[

function longRef() {

    var t0 = new Date().getTime();
    
    var tmp;
    for(var i = 0; i < 10000; i++) {
        tmp = window.document.forms[0].elements[0];
    }
    return new Date().getTime() - t0;
}

function shortRef() {

    var t0 = new Date().getTime();
    
    var input0 = window.document.forms[0].elements[0];
    var tmp;
    for(var i = 0; i < 10000; i++) {
        tmp = input0;
    }
    return new Date().getTime() - t0;
}

// ]]>
</script>
</pre>
</body>
</html>
